<!doctype html>
<html th:fragment="layout (title, main_content)" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <!--IE Compatibility modes-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--Mobile first-->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>管理系统</title>
    <meta name="description" content="Free Admin Template Based On Twitter Bootstrap 3.x">
    <meta name="author" content="">
    <meta name="msapplication-TileColor" content="#5bc0de" />
    <meta name="msapplication-TileImage" content="/static/img/metis-tile.png" />
    <!-- Bootstrap -->
    <link rel="stylesheet" href="/static/lib/bootstrap/css/bootstrap.css">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="/static/lib/font-awesome/css/font-awesome.css">
    <!-- Metis core stylesheet -->
    <link rel="stylesheet" href="/static/css/main.css">
    <!-- metisMenu stylesheet -->
    <link rel="stylesheet" href="/static/lib/metismenu/metisMenu.css">
    <!-- animate.css stylesheet -->
    <link rel="stylesheet" href="/static/lib/animate.css/animate.css">
    <!--For Development Only. Not required -->
    <script>
        less = {
            env: "development",
            relativeUrls: false,
            rootpath: "//static/"
        };
    </script>
    <link rel="stylesheet" href="/static/css/style-switcher.css">
    <link rel="stylesheet" href="/static/css/common.css">
    <link rel="stylesheet/less" type="text/css" href="/static/less/theme.less">

    <script src="/static/js/less.js"></script>
    <script src="/static/laydate/laydate.js"></script>

    <!--jQuery -->
    <script src="/static/lib/jquery/jquery.js"></script>
    <script src="/static/js/jquery-form.js" type="text/javascript" charset="utf-8"></script>
</head>

<body class="bg-dark dk">
    <div class="bg-dark dk" id="wrap">
        <div id="top">
            <!-- .navbar -->
            <nav class="navbar navbar-inverse  navbar-static-top">
                <div class="container-fluid">

                    <!-- Brand and toggle get grouped for better mobile display -->
                    <header class="navbar-header">
                        <a href="/backend/stats/index" style="padding:15px;" class="navbar-brand">债匹后台系统</a>
                    </header>

                    <div class="topnav">
                        <div class="btn-group">
                            <a data-placement="bottom" data-original-title="Fullscreen" data-toggle="tooltip"
                               class="btn btn-default btn-sm" id="toggleFullScreen">
                                <i class="glyphicon glyphicon-fullscreen"></i>
                            </a>
                        </div>
                        <div class="btn-group">
                            <a href="/backend/manager/update-password" data-placement="bottom" data-original-title="update password" data-toggle="tooltip" class="btn btn-default btn-sm" >
                                <i class="glyphicon glyphicon-wrench"></i>
                            </a>
                        </div>
                        <div class="btn-group">
                            <a href="/login?logout" data-toggle="tooltip" data-original-title="Logout" data-placement="bottom" class="btn btn-metis-1 btn-sm">
                                <i class="fa fa-power-off"></i>
                            </a>
                        </div>
                        <div class="btn-group">
                            <a data-placement="bottom" data-original-title="show/hide " data-toggle="tooltip"
                               class="btn btn-primary btn-sm toggle-left" id="menu-toggle">
                                <i class="fa fa-bars"></i>
                            </a>
                            <a data-placement="bottom" data-original-title="Show / Hide Right" data-toggle="tooltip"
                               class="btn btn-default btn-sm toggle-right">
                                <span class="glyphicon glyphicon-comment"></span>
                            </a>
                        </div>
                    </div>

                    <div class="collapse navbar-collapse navbar-ex1-collapse">

                        <!-- .nav -->
                        <ul class="nav navbar-nav">
                            <li th:class="${menu eq 'menu_study'}? 'active':''">  <a target="_self" href="/study/index">study</a> </li>
                            <li th:class="${menu eq 'menu_privacy'}? 'active':''">  <a target="_self" href="/privacy/index">个人</a> </li>
                        </ul>
                        <!-- /.nav -->

                    </div>
                </div>
                <!-- /.container-fluid -->
            </nav>
            <!-- /.navbar -->
            <!--<header class="head">
                <div class="main-bar">
                    <h3>
                        <i class="fa fa-home"></i>&nbsp;
                        内容
                    </h3>
                </div>
                <!-- /.main-bar -->
            <!--</header> -->
            <!-- /.head -->

        </div>
        <!-- /#top -->

        <!-- left -->
        <div id="left">
            <div th:if="${menu eq 'menu_study'}" th:insert="~{layouts/menu_study :: menu}"></div>
            <div th:if="${menu eq 'menu_privacy'}" th:insert="~{layouts/menu_privacy :: menu}"></div>

        </div>
        <!-- /#left -->


        <!-- content -->
        <div id="content">
            <div class="outer">
                <div class="inner bg-light lter">
                    <div id="showError" style="display:none" class="bs-example bs-example-standalone" data-example-id="dismissible-alert-js">
                        <div id="errorClass" class="alert alert-danger alert-dismissible fade in" role="alert">
                            <button type="button" class="close" data-dismiss="" aria-label="Close"><span id="closeErrorMsg" aria-hidden="true">×</span></button>
                            <strong style="display: block;text-align: center" id="errotmsg"></strong>
                        </div>
                    </div>
                    <?=$content?>
                    <div th:replace="${main_content}" id="main_content"></div>
                </div>
                <!-- /.inner -->
            </div>
            <!-- /.outer -->
        </div>
        <!-- /#content -->

        <div id="right" class="bg-light lter"></div>
    </div>
    <!-- /#wrap -->

    <footer class="Footer bg-dark dker">
        <p>java学习指南 京ICP备16024802号</p>
    </footer>

    <!--Bootstrap -->
    <script src="/static/lib/bootstrap/js/bootstrap.js"></script>
    <!-- MetisMenu -->
    <script src="/static/lib/metismenu/metisMenu.js"></script>
    <!-- Screenfull -->
    <script src="/static/lib/screenfull/screenfull.js"></script>


    <!-- Metis core scripts -->
    <script src="/static/js/core.js"></script>
    <!-- Metis demo scripts -->
    <!-- <script src="/static/js/app.js"></script> -->

    <script src="/static/js/style-switcher.js"></script>

</body>
</html>
